
<template>
  <view class="notice-bar bg-fff color333 mx-2 font26">
    <view class="notice-icon">
      <uni-icons type="sound" size="16" color="#598dfc"></uni-icons>
<!--       #ifdef H5-->
	   <text class="iconfont icon-gonggao main-color"></text>
<!--       #ifdef H5-->
    </view>
    <view class="notice-content">
      <swiper 
	    vertical
        autoplay 
        circular 
        interval="3000" 
        class="notice-swiper"
        :style="{height: singleHeight + 'px'}"
      >
        <swiper-item v-for="(item, index) in notices" :key="index">
          <view class="notice-item">{{item.content}}</view>
        </swiper-item>
      </swiper>
    </view>
  </view>
</template>

<script>
export default {
  props: {
    notices: {
      type: Array,
      default: () => []
    }
  },
  data() {
    return {
      singleHeight: 20
    }
  },
  mounted() {
  },
  methods: {
    calcHeight() {
     
    }
  }
}
</script>

<style scoped>
.notice-bar {
  display: flex;
  align-items: center;
  padding: 10rpx 24rpx;
  border-radius: 20rpx;
}
.notice-icon {
  margin-right: 16rpx;
}
.notice-content {
  flex: 1;
  overflow: hidden;
}
.notice-swiper {
  line-height: 40rpx;
}
.notice-item {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
</style>
